<!--
  * 项目结项审核
-->
<template>
  <div v-if="isShow == 0">
    <!---------- 查询表单form begin ----------->
    <a-form class="smart-query-form">
      <a-row class="smart-query-form-row">
        <a-form-item label="关键字查询" class="smart-query-form-item">
          <!-- <a-input style="width: 200px" v-model:value="queryForm.key" placeholder="关键字查询" /> -->
          <a-input style="width: 200px" v-model:value="queryForm.key" placeholder="关键字查询" />
        </a-form-item>
        <a-form-item class="smart-query-form-item">
          <a-button type="primary" @click="queryData('1')">
            <template #icon>
              <SearchOutlined />
            </template>
            查询
          </a-button>
          <a-button @click="resetQuery" class="smart-margin-left10">
            <template #icon>
              <ReloadOutlined />
            </template>
            重置
          </a-button>
        </a-form-item>
      </a-row>
    </a-form>
    <!---------- 查询表单form end ----------->

    <a-card size="small" :bordered="false" :hoverable="true">
      <!---------- 表格操作行 begin ----------->
      <a-row class="smart-table-btn-block">
        <div class="smart-table-operate-block">
          <!-- <a-button @click="confirmBatchDelete" type="primary" danger
                        :disabled="selectedRowKeyList.length === 0">
                        <template #icon>
                            <DeleteOutlined />
                        </template>
                        批量删除
                    </a-button> -->
        </div>
        <span class="smart-table-column-operate">
          <TableOperator v-model="columns" :tableId="TABLE_ID_CONST.SYSTEM.EMPLOYEE" :refresh="queryData" />
        </span>
      </a-row>
      <!---------- 表格操作行 end ----------->

      <!---------- 表格 begin ----------->
      <a-table size="small" :dataSource="tableData" :columns="columns" rowKey="blclosureid" bordered
        :loading="tableLoading" :pagination="false" :scroll="{ x: 1500 }">
        <template #bodyCell="{ text, record, column }">
          <template v-if="column.dataIndex === 'blprojectname'">
            <a-button type="link" @click="budgetDetail(record)">{{ record.blprojectname }}</a-button>
          </template>
          <template v-if="column.dataIndex === 'blstate'">
            <span v-if="record.blstate != 7" :style="record.blstate == !7 ? 'color:red' : ''">审批完成,待盖章</span>
            <span v-else style="color: #37b411">审核完成</span>
          </template>
          <template v-if="column.dataIndex === 'process'">
            <div class="smart-table-operate">
              <a-button v-if="record.blstate != 7" type="link" @click="showForm(record)">点击上传扫描件</a-button>
              <span v-else type="link">扫描件已上传</span>
            </div>
          </template>
          <template v-if="column.dataIndex === 'appRecord'">
            <div class="smart-table-operate">
              <a-button type="link" @click="appRecord(record)">点击查看申报记录</a-button>
            </div>
          </template>
        </template>
      </a-table>
      <!---------- 表格 end ----------->
      <!-- 分页-->
      <div class="smart-query-table-page">
        <a-pagination showSizeChanger showQuickJumper show-less-items :pageSizeOptions="PAGE_SIZE_OPTIONS"
          :defaultPageSize="queryForm.limit" v-model:current="queryForm.page" v-model:pageSize="queryForm.limit"
          :total="total" @change="queryData" @showSizeChange="queryData" :show-total="(total) => `共${total}条`" />
      </div>
    </a-card>
    <!-- 点击上传扫描件 -->
    <ExamineUpload ref="formRef" @refresh="queryData"></ExamineUpload>
  </div>
  <!-- 新增年度预算 -->
  <ProComAdd v-else-if="isShow == 1" @emitPass="changeShow" />
  <!-- 年度预算详情 -->
  <ProComDetail v-else-if="isShow == 2" @emitPass="changeShow" :passData="passData" />
  <!-- 流程 -->
  <ProComProcess v-else-if="isShow == 3" @emitPass="changeShow" :passData="passData" />
  <!-- 申报记录 -->
  <ProComRecord v-else-if="isShow == 4" @emitPass="changeShow" :passData="passData" />
  <!-- 修改 -->
  <ProComUpdate v-else-if="isShow == 5" @emitPass="changeShow" :passData="passData" />
</template>
<script setup>
  import { reactive, ref, onMounted, computed } from 'vue';
  import { message, Modal } from 'ant-design-vue';
  import { SmartLoading } from '/@/components/framework/smart-loading';
  import { ProManageApi } from '/@/api/ProManage/ProManage-api';
  import { PAGE_SIZE, PAGE_SIZE_OPTIONS } from '/@/constants/common-const';
  import { smartSentry } from '/@/lib/smart-sentry';
  import ProComAdd from './modules/ProComAdd.vue';
  import ProComDetail from './modules/ProComDetail.vue';
  import ProComProcess from './modules/ProComProcess.vue';
  import ProComRecord from './modules/ProComRecord.vue';
  import ProComUpdate from './modules/ProComUpdate.vue';
  import ExamineUpload from './modules/ExamineUpload.vue';

  import _ from 'lodash';
  import { TABLE_ID_CONST } from '/@/constants/support/table-id-const';
  import TableOperator from '/@/components/support/table-operator/index.vue';
  import { useUserStore } from '/@/store/modules/system/user';
  // ---------------------------- 表格列 ----------------------------

  const columns = ref([
    {
      title: '项目名称',
      dataIndex: 'blprojectname',
      align: 'center',
    },
    {
      title: '项目负责人',
      dataIndex: 'blprojectmanagepeople',
      align: 'center',
    },
    {
      title: '申报状态',
      dataIndex: 'blstate',
      align: 'center',
    },
    {
      title: '审核流程',
      dataIndex: 'process',
      align: 'center',
    },
    {
      title: '申报记录',
      dataIndex: 'appRecord',
      align: 'center',
    },
    {
      title: '预算合计',
      dataIndex: 'blext5',
      align: 'center',
    },
    {
      title: '实际支出合计',
      dataIndex: 'blext6',
      align: 'center',
    },
  ]);

  // ---------------------------- 查询数据表单和方法 ----------------------------
  const blsysuserid = ref('');
  blsysuserid.value = computed(() => useUserStore().blsysuserid);
  const queryFormState = {
    key: '',
    key1: blsysuserid.value.value,
    page: 1,
    limit: PAGE_SIZE,
  };
  // 查询表单form
  const queryForm = reactive({ ...queryFormState });
  // 表格加载loading
  const tableLoading = ref(false);
  // 表格数据
  const tableData = ref([]);
  // 总数
  const total = ref(0);

  // 控制父组件是否展示
  // 0原表格 1新增 2详情 3流程 4记录 5 修改
  const isShow = ref(0);
  // 改变父组件展示状态
  function changeShow(value) {
    isShow.value = value.type;
    queryData();
  }
  // 新建
  function addHandle(data) {
    isShow.value = 1;
  }
  // 查看项目详情
  const passData = ref();
  function budgetDetail(data) {
    isShow.value = 2;
    passData.value = data;
  }
  // 项目流程
  function process(data) {
    isShow.value = 3;
    passData.value = data;
  }
  // 申报记录
  function appRecord(data) {
    isShow.value = 4;
    passData.value = data;
  }
  // 修改
  function updateCom(data) {
    isShow.value = 5;
    passData.value = data;
  }
  // ---------------------------- 审批 ----------------------------
  const formRef = ref();
  function showForm(data) {
    formRef.value.showModal(data);
  }
  // 重置查询条件
  function resetQuery() {
    let pageSize = queryForm.limit;
    Object.assign(queryForm, queryFormState);
    queryForm.limit = pageSize;
    queryData();
    searchPage.value = false
  }
<<<<<<< HEAD
  const searchPage = ref(false)//检索的翻页
=======
>>>>>>> yx
  // 查询数据
  async function queryData(a) {
    tableLoading.value = true;
    try {
      if (a === '1') {
        queryForm.page = 1;
        searchPage.value = true
      }
      if (!searchPage.value) {
        queryForm.key = undefined;
      }
      let dd = Object.keys(queryForm)
        .map((key) => key + '=' + queryForm[key])
        .join('&');
      let queryResult = await ProManageApi.getExamineList(dd);
      tableData.value = queryResult.data.records;
      total.value = queryResult.data.total;
    } catch (e) {
      smartSentry.captureError(e);
    } finally {
      tableLoading.value = false;
    }
  }

  onMounted(queryData);

  // ---------------------------- 单个删除 ----------------------------
  //确认删除
  function onDelete(data) {
    Modal.confirm({
      title: '提示',
      content: '确定要删除吗?',
      okText: '删除',
      okType: 'danger',
      onOk() {
        requestDelete(data);
      },
      cancelText: '取消',
      onCancel() { },
    });
  }

  //请求删除
  async function requestDelete(data) {
    SmartLoading.show();
    try {
      let array = [data.blclosureid];
      await ProManageApi.deleteCom(array);
      message.success('删除成功');
      const totalPage = Math.ceil((total.value - 1) / PAGE_SIZE);
      const currentPage = queryForm.page > totalPage ? totalPage : queryForm.page;
      queryForm.page = currentPage < 1 ? 1 : currentPage;
      queryData();
    } catch (e) {
      smartSentry.captureError(e);
    } finally {
      SmartLoading.hide();
    }
  }

  // ---------------------------- 批量删除 ----------------------------

  // 选择表格行
  const selectedRowKeyList = ref([]);

  function onSelectChange(selectedRowKeys) {
    selectedRowKeyList.value = selectedRowKeys;
  }

  // 批量删除
  function confirmBatchDelete() {
    if (_.isEmpty(selectedRowKeyList.value)) {
      message.success('请选择要删除的数据');
      return;
    }
    Modal.confirm({
      title: '提示',
      content: '确定要批量删除这些数据吗?',
      okText: '删除',
      okType: 'danger',
      onOk() {
        requestBatchDelete();
      },
      cancelText: '取消',
      onCancel() { },
    });
  }

  //请求批量删除
  async function requestBatchDelete() {
    try {
      SmartLoading.show();
      await ProManageApi.deleteCom(selectedRowKeyList.value);
      selectedRowKeyList.value.length = 0;
      message.success('删除成功');
      const totalPage = Math.ceil((total.value - 1) / PAGE_SIZE);
      const currentPage = queryForm.page > totalPage ? totalPage : queryForm.page;
      queryForm.page = currentPage < 1 ? 1 : currentPage;
      queryData();
    } catch (e) {
      smartSentry.captureError(e);
    } finally {
      SmartLoading.hide();
    }
  }
</script>